<template>
  <div>
    <!-- 面包屑 -->
    <el-breadcrumb separator="/">
      <el-breadcrumb-item>个人中心</el-breadcrumb-item>
      <el-breadcrumb-item>用户信息</el-breadcrumb-item>
    </el-breadcrumb>
    <!-- 卡片 -->
    <el-card>
        <!-- 个人信息 表单 -->
        <el-form
          :model="ownForm"
          label-width="80px"
          style="width:400px"
          disabled
        >
          <!-- <el-form-item label="用户名" prop="name">
            <el-input v-model="ownForm.name"></el-input>
          </el-form-item> -->
          <el-form-item label="手机号" prop="phone">
            <el-input v-model="ownForm.phone"></el-input>
          </el-form-item>
          <el-form-item label="公司" prop="companyName">
            <el-input v-model="ownForm.companyName"></el-input>
          </el-form-item>
          <el-form-item label="项目" prop="item">
            <el-input v-model="ownForm.item"></el-input>
          </el-form-item>
          <el-form-item label="岗位" prop="roleName">
            <el-input v-model="ownForm.roleName"></el-input>
          </el-form-item>
        </el-form>

        <el-button style="margin-left:80px" type="primary" @click="updateDialog=true">修改密码</el-button>

      <!-- 修改密码 对话框 -->
      <el-dialog v-model="updateDialog" title="修改密码" width="50%" @close="updateDialogClose">
        <el-form
          :model="updateForm"
          ref="updateForm"
          label-width="100px"
        >
          <el-form-item label="原密码" prop="password" :rules="[{required: true, message: `不能为空`, trigger: 'blur'}]">
            <el-input v-model="updateForm.password" show-password ></el-input>
          </el-form-item>
          <el-form-item label="新密码" prop="checkPass" :rules="[{required: true, message: `不能为空`, trigger: 'blur'}]">
            <el-input v-model="updateForm.checkPass" show-password></el-input>
          </el-form-item>
        </el-form>
        <template #footer>
          <span class="dialog-footer">
            <el-button @click="updateDialog = false">取消</el-button>
            <el-button type="primary" @click="updateDialog = false">确定</el-button>
          </span>
        </template>
      </el-dialog>
    </el-card>
  </div>
</template>

<script>
export default {
  data() {
    return {
      // 如果用户多公司多项目，返回的则是当前公司当前项目
      ownForm: {
        // name: "zhangsan",
        // phone: "12312341234",
        // company: "聪明无限公司",
        // item: "生发项目",
        // role: "项目负责人"
      },
      updateForm: {
        password: "",
        repass:""
      },
      updateFormRules: {},
      updateDialog: false,
    };
  },
  mounted(){
    this.getOwnForm();
  },
  methods:{
    updateDialogClose(){
      console.log("close")
    },
    async getOwnForm(){
      const { data: res } = await this.$http.get("user/getOwner", {});
      console.log(res);
      if (res.code == 200) {
        this.ownForm = res.data;
      } else {
        return this.$message.error(res.msg);
      }
    }
  }
};
</script>

